FrontPage Theme Lesson Practice
Learn how to modify a theme with your own buttons.
Lesson by Mr. C.

Home
Page 1
Page 2
Page 3

See more themes at Fhayden.com

See themes for sale at ThemeMart.com

See a Yahoo search for FrontPage and Themes

Read another lesson by Mr. C on Themes

Directions
Please follow these steps to learn how to create your own theme buttons.

Topics to learn:

  1. Creating GIF images with Paintshop Pro (256 colors)
  2. Exporting Transparent GIF images with Paintshop Pro
    (this will allow for space between buttons)
  3. Modify a theme with FrontPage
  4. Saving a theme

Lesson Goals:

  1. To practice making this custom theme.
  2. To apply this theme and understand the process.

Follow these steps:

  1. New image with Paintshop Pro 160 x 30 x 256 colors, green background
    NOTE: This green will be made transparent and will not display! This will cause a space between the buttons. You will see. 
  2. Using the select menu, select all.
  3. Using the selection menu, modify, contract 3 pixels.
  4. Using the flood fill tool, fill the selection with a solid red.
  5. Use the selection menu, modify the selection, contract 2 pixels.
  6. Flood fill the selection with blue.
  7. Go to Colors menu, increase colors to 16.7 million.
  8. Set your BACKGROUND color to white. (this will be used in the buttonize window)
  9. Use the image menu, effects, buttonize, set the following attributes.
  10. Drop the selection. ( Right click, or Selection menu, none.)
  11. You have your first button!
  12. Copy paste this button as a new image. This will be button #2
  13. Image flip, Image mirror button #2
  14. Look at the effect of the lighting! Very cool mouse over effect right there!
  15. Copy paste a third button from button #2.
    Here is what your screen will look like.
  16. Using the eye dropper, set your background color to green. Right click dropper on the green.
  17. Using the selection tool, select and move the edges of button #3 towards the center.
    See example below.
  18. YOUR THREE BUTTONS ARE READY FOR EXPORT!
    We will export GIF images for use in FrontPage Themes!
  19. Click Button #1 to activate that drawing.
  20. File, then Export, GIF
  21. Set the transparency to the green color.
  22. Click the colors tab, set the colors to a STANDARD WEB SAFE PALETTE.
  23. Click OK, and save this in your FP2000/images folder.
    NAME THIS  ButtonPicture1  (the file type will be GIF)
  24. Save the Button #2 the same way. Export a GIF, set the transparency to green.
    NAME THIS ButtonSelected1  (the file type will be GIF)
  25. Save Button #3 the same way.  Export a GIF, set the transparency to green.
  26. NAME THIS ButtonHovered1  (the file type will be GIF)
  27. YOU ARE NOW READY TO APPLY THESE BUTTONS IN A FRONTPAGE THEME.
  28. Open your web site with Frontpage.
  29. Select Format, Theme.
  30. Make sure the dot for ALL PAGES is selected.
  31. Click MODIFY, then GRAPHICS
  32. Select VERTICAL NAVIGATION
  33. Browse for your buttons. ButtonPicture1, ButtonSelected1, ButtonHovered1.
    See screen below. (Now you know why we named the buttons with those names)
  34. Click OK.
  35. DANGER.....DANGER....USE SAVE AS....
  36. DO NOT SAVE AS THE ORIGINAL THEME'S NAME.
  37. CLICK SAVE AS...
  38. Use your name as the theme name. NO SPACES or you will create a 553 error.
    See screen below. 
  39. Save your theme.
  40. CONGRATULATIONS! You have created your first custom theme!

This exact theme has been applied to this web site. Surf these demo pages and study the theme buttons.

Note:

To see more examples of custom themes.
Stop by my web site at...http://Fhayden.com